/* 全局变量 和 函数*/
@import './util.scss';

:root {
  --transition--time: 0.28s; // 过渡时间
  --sidebar--width: 210px; // 侧边栏宽度
}

/* Element Chalk Variables */
$--color-primary: #3E7BFA !default;

// base color
$color: #3e7bfa; // 默认主题色
$colorActive: #0e2877; // 默认激活色
$colorBg: #F3F6F9; //默认背景色
$contentBg: #F3F6F9; //内容区域默认背景色
$colorFill: white; //默认填充色
$theme-color-bg: white;
$theme-color-block: #494949;
$theme-color-gray1: #666666;
$theme-color-gray2: #949494;
$theme-color-gray3: #cfcfcf;
$theme-box-shadow-004010: 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
$theme-box-shadow-024009: 0px 2px 4px 0px rgba(0, 0, 0, 0.09);
$blue: #324157;
$light-blue: #3a71a8;
$red: #c03639;
$pink: #e65d6e;
$green: #30b08f;
$tiffany: #4ab7bd;
$yellow: #fec171;
$panGreen: #30b08f;
$borderB: #b7cfe7; // 边框颜色
$transitionTime: var(--transition--time); // 菜单折叠过渡时间
$white: #ffffff;

// 顶部页眉
$eyebrowHeight: 70px; // 顶部页眉高度
$eyebrowBgc: #4385f5; // 顶部页眉背景色

// 顶部导航
$navbarHeight: 40px; // 顶部导航条高度
$operationNavHeight: 40px; // 功能导航高度
$navbarBgc: #004c99; // 顶部导航条背景色
$topNavHeight: $eyebrowHeight + $navbarHeight + $operationNavHeight; // 内容距离顶部高度

// 侧边栏
$menuText: #333333; // 菜单颜色
$menuActiveText: #0099ff; // 菜单选中颜色
$subMenuActiveText: #333333; // 子菜单选中时父级颜色
$hideSidebarWidth: 54px; // 侧边栏折叠后的宽度
$menuBg: #f3f9ff; // 菜单背景色
$sideBarBgc: #f3f9ff; // 侧边栏整体背景色

$menuHover: #0099ff;
$menuHoverText: #0099ff;
$menuHoverBgc: #f3f9ff;

$subMenuBg: #f3f9ff; // 子菜单背景色
$subMenuHover: #f3f9ff; // 子菜单hover背景色
$sideBarWidth: var(--sidebar--width); // 侧边栏宽度

$widthBlacklistLibrary: 280px; //黑名单库组件宽度
$heightFormItem: 35px;
$sizeLarge: 20px;
$sizeBig: 16px;
$sizeSmall: 14px;
$sizeMini: 12px;

$layoutScreenHeadHeight: 110px;
$leftRightPanelNoPx: 516;
$leftRightPanel: #{$leftRightPanelNoPx}px;

// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
  menuText: $menuText;
  menuActiveText: $menuActiveText;
  subMenuActiveText: $subMenuActiveText;
  menuBg: $menuBg;
  sideBarBgc: $menuBg;
  menuHover: $menuHover;
  subMenuBg: $subMenuBg;
  subMenuHover: $subMenuHover;
  sideBarWidth: $sideBarWidth;
  eyebrowHeight: $eyebrowHeight;
}
